// cloud.js - 优化后的云滚动动画
$(document).ready(function() {
    const $cloud1 = $("#cloud1");
    const $cloud2 = $("#cloud2");
    let windowWidth = $(window).width();
    let cloudWidth = 1000; // 假设云图片宽度为1000px
    
    // 初始化云位置和速度
    let cloud1Pos = 0;
    let cloud2Pos = -windowWidth / 2;
    const cloud1Speed = 1.5;
    const cloud2Speed = 1;

    
    // 动画函数
    function animateClouds() {
        windowWidth = $(window).width();
        
        // 更新云位置
        cloud1Pos += cloud1Speed;
        cloud2Pos += cloud2Speed;
        
        // 重置逻辑 - 当云完全移出右侧时
        if (cloud1Pos >= windowWidth) {
            cloud1Pos = -cloudWidth;
        }
        if (cloud2Pos >= windowWidth) {
            cloud2Pos = -cloudWidth;
        }
        
        // 应用新位置
        $cloud1.css('background-position', `${cloud1Pos}px 0`);
        $cloud2.css('background-position', `${cloud2Pos}px 0`);
        
        requestAnimationFrame(animateClouds);
    }
    
    // 启动动画
    animateClouds();
    
    // 响应窗口大小变化
    $(window).resize(() => {
        windowWidth = $(window).width();
    });
});